<template>
  <div class="footer">
	  <div class="wrapper">
		  <div class="footer_icon" v-for='item of iconImg' :key='item.id'>
			  <div class="footer_icon_img"><img :src="item.imgUrl"></div>
			  <div>{{item.Desc}}</div>
		  </div>
		  <div class="footer_infor">
			  <a href="">电脑版</a>
			  <a href="">简体中文</a>
			  <a href="">意见反馈</a>
		  </div>
		  <div class="footer_bottom">©2019同程旅游</div>
	  </div>
  </div>
</template>

<script>
export default {
  name: 'homeFooter',
   data(){
  	  return{
  		  iconImg:[
  			  {
  				  id:'001',
  				  imgUrl:'//pic5.40017.cn/02/000/64/7b/rBLkCVqp3pSAND1WAAACDBVkQaU993.png',
  				  Desc:'客服电话'
  			  },
  			  {
  			      id:'002',
  			      imgUrl:'//pic5.40017.cn/01/000/64/74/rBLkBlqp3pSAUjDFAAAAqM2yKYA236.png',
  				  Desc:'下载客户端'
  			  },
  			  {
  			      id:'003',
  			      imgUrl:'//pic5.40017.cn/02/001/64/7b/rBLkCVqp3pSAItBpAAABv-mJDd4590.png',
  				  Desc:'我的同程'
  			  }
  			 
  		  ]
  	  }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="stylus" scoped>
.footer
	width:100%
	background:#f2f4f7
	padding:0.3rem 0
	.wrapper
		width:90%
		margin:0 auto
		.footer_icon
			width:33%
			text-align:center
			float:left
			margin-bottom:0.3rem
			.footer_icon_img
				margin-bottom:0.1rem
		.footer_infor
			text-align:center
			margin-bottom:0.3rem
			a
				margin-left:0.3rem
		.footer_bottom
			text-align:center
			margin-bottom:0.3rem
</style>
